<#--<#include "../layout/base.ftl">-->
<#--<#macro header>-->
<style type="text/css">
    #user-search-panel span.label {
        margin-left: 10px;
    }

    #user-search-panel .input-text {
        border: 1px solid #6D869E;
        height: 18px;
        vertical-align: middle;
        width: 137px;
    }

    #user-search-panel span.om-combo, #user-search-panel span.om-calendar {
        vertical-align: middle;
    }

    .form {
        float: left;
        width: 100%;
        text-align: left;
        border-collapse: collapse;
        background: #fff;
    }

    .form caption {
        font-size: 16px;
        font-weight: bold;
        letter-spacing: 2px;
        color: #19609d
    }

    .form th {
        text-align: right;
        font-size: 14px
    }

    .form tr, .form td {
        padding-left: 3px;
        height: 25px
    }

    .form a:link, .form a:visited {
        color: #246ab5;
        text-decoration: underline
    }

    .form a:hover, .form a:active {
        text-decoration: underline
    }

    .se {
        background: #fafbfe
    }

    .outtable {
        border-collapse: collapse;
    }

    .outtable th {
        border: 1px #d9dde1 solid;
        font-weight: normal;
        color: #173d72;
        text-align: left;
        text-indent: 6px;
        background: #fafbfe;
    }

    .outtable td {
        border: 1px #d9dde1 solid;
        padding: 3px;
        font-size: 14px;
        background: #fff
    }

</style>
<script type="text/javascript">
    $(function () {
        $("#user-search-panel").omPanel({
            title: "高级搜索"
        });

        $('span#user-button-search').omButton({
            width: 70,
            icons: {left: '${base}/css/default/images/advanced/search.png'},
            onClick: function (event) {
                var url = "${base}/cfg/user_grid_json?userName=" + $("#user_userName").val();
                $('#user_grid').omGrid("setData", encodeURI(url));
            }
        });

        $('#user_button_bar').omButtonbar({
            width: '100%',
            btns: [
                {id: "save_user",
                    icons: {left: '${base}/css/default/images/edit_add.png'},
                    label: "保存用户映射",
                    onClick: function () {
                        var data = "[";
                        var rows = $('#user_grid').omGrid('getData').rows;
                        for (var i = 0; i < rows.length; i++) {
                            var jiuqiuserName = $("input[name='jiuqiuserName']")[i].value;
                            var jiuqipass = $("input[name='jiuqipass']")[i].value;
                            data += "{'userName':'" + rows[i].userName + "','jiuqiname':'" + jiuqiuserName + "','jiuqipass':'" + jiuqipass + "'}";
                            data += ','
                        }
                        if (data.length > 1)
                            data = data.substring(data, data.length - 1) + ']';
                        $.post('${base}/cfg/save_user_grid', {'data': data}, function (data) {
                            $('#user_grid').reload();
                        });
                    }
                }
            ]
        });


        var url = "${base}/cfg/user_grid_json?userName=" + $("#user_userName").val();

        var grid = $('#user_grid').omGrid({
            dataSource: encodeURI(url),
            height: 350,
            width: 'fit',
            autoFit: true,
            limit: 20,

            colModel: [
                {header: '用户名', name: 'userName', align: 'left'},
                {header: '久期用户名', name: 'jiuqiuserName', align: 'center', renderer: function (colValue, rowData, rowIndex) {
                    var data = rowData;
                    return '<input name="jiuqiuserName" type="text"  value="' + colValue + '"></input>';
                }},
                {header: '久期密码', name: 'jiuqipass', align: 'center', renderer: function (colValue, rowData, rowIndex) {
                    var data = rowData;
                    return '<input name="jiuqipass" type="password"  value="' + colValue + '"></input>';
                }}
            ]
        });

        $(window).scroll(function () {
            $("#user_grid").omGrid('resize');
        });
    });


</script>
<#--</#macro>-->
<#--<#macro body>-->
<div id="user-search-panel">
    <div style="width: 800px;">
        <span class="label">用户姓名：</span>
        <input id="user_userName"/>

        <span id="user-button-search">搜索</span>
    </div>
</div>
<div id="user_button_bar"/>
<table id="user_grid">

</table>

